<template>
	<tabbar :tabs="tabs" :current="currentTab" @onTabClick="onTabClick" @onTabMidButtonClick="onTabMidButtonClick">
		<Index v-if="currentTab===0" class="h-full" @tabClick="onTabClick"></Index>
		<Count v-if="currentTab===1" class="h-full"></Count>
		<Mine v-if="currentTab===2" class="h-full"></Mine> 
	</tabbar>
</template>

<script setup>
	import { ref } from 'vue'
	import Index from '@/pages/index/index.vue'
	import Count from '@/pages/count/count.vue'
	import Mine from '@/pages/mine/mine.vue'
	
	const tabs = ref([
		{
			icon: '../../static/image/tabs/tab-home.png',
			iconSelect: '../../static/image/tabs/tab-home-active.png',
			text: '工作台',
			iconfont: '',
			show: true,
			mark: 0
		},{
			icon: '../../static/image/tabs/tab-vector.png',
			iconSelect: '../../static/image/tabs/tab-vector-active.png',
			text: '统计',
			iconfont: '',
			show: true,
			mark: 0
		},{
			icon: '../../static/image/tabs/tab-mine.png',
			iconSelect: '../../static/image/tabs/tab-mine-active.png',
			text: '商户中心',
			iconfont: '',
			show: true,
			mark: 0
		}
	])
	
	const currentTab = ref(0)
	const currentComponent = ref(null)
	
	const onTabClick = (data) => {
		if (data.index !== currentTab.value) {
			currentTab.value = data.index
		}
	}
	
	const onTabMidButtonClick = (data) => {
		// console.log(data,'ddd')
		// console.log(tab,index)
		currentTab.value = data.index
	}
</script>

<style>

</style>
